<template>
  <div class="">
  <el-tabs v-model="activeName" class="channel_email_set">
    <el-tab-pane :label="one.name" :name="one.value" v-for="one in menu" :disabled="one.disabled"></el-tab-pane>
    <keep-alive>
      <component :is="activeName" class="content"></component>
    </keep-alive>
  </el-tabs>
  </div>
</template>
<script>
  import MailRegistered from './MailRegistered.vue'
  import MailTemplate from './MailTemplate.vue'
  import FirmMail from './FirmMail.vue'
  import EndSessionCategory from './EndSessionCategory.vue'
  import MailSignature from './MailSignature.vue'
  import MailQuickReplay from './MailQuickReplay.vue'
  import MailSatisfied from './MailSatisfied.vue'
  function getMailStatus (store, data) {
    return store.dispatch('getMailStatus', data)
  }

  export default {
    name: 'MailCustomerService',
    data () {
      return {
        activeName: 'MailRegistered',
        loading: false,
        MailRegisteredShow: true,
        EnterpriseMailShow: false,
        MailTemplateShow: false,
        EndSessionCategoryShow: false,
        MailSignatureShow: false,
        QuickReplayShow: false,
        menu: [
          {name: this.$t('config.channel.emailRegistered'), value: 'MailRegistered', disabled: false},
          {name: this.$t('config.channel.enterpriseEmail'), value: 'FirmMail', disabled: true},
          {name: this.$t('config.channel.emailTemplate'), value: 'MailTemplate', disabled: true},
          {name: this.$t('config.channel.endSessionCategory'), value: 'EndSessionCategory', disabled: false},
          {name: this.$t('config.channel.emailSignature'), value: 'MailSignature', disabled: true},
          {name: this.$t('config.channel.quickReplay'), value: 'MailQuickReplay', disabled: false},
          {name: this.$t('configLazyLoad.channel.satisConfig'), value: 'MailSatisfied', disabled: false}
        ]
      }
    },
    computed: {
      status () {
        return this.$store.state.config.channelConfig.channelMail.status
      }
    },
    watch: {
      status () {
        if (this.status === 'open') {
          this.menu.forEach((item) => {
            item.disabled = false
          })
        }
      }
    },
    methods: {
      fetchData () {
        getMailStatus(this.$store, {}).then(() => {
          this.loading = true
        })
      },
      handleClick (tab, event) {
        this.activeName = tab
//        this[tab.name + 'Show'] = true
      }
    },
    components: {
      MailRegistered,
      MailTemplate,
      FirmMail,
      EndSessionCategory,
      MailSignature,
      MailQuickReplay,
      MailSatisfied
    },
    beforeMount () {
      this.fetchData()
//      let status = this.$store.state.config.channelConfig.channelMail.status
      if (this.status === 'open') {
        this.menu.forEach((item) => {
          item.disabled = false
        })
      }
    }
  }
</script>
<style lang="stylus" scoped>
  @import "../../../../../assets/common.styl"
</style>
